<template>
	<view class="p30">
		<view class="flex-column-center">
			<view class="flex-center wper100 mt30">
				<view class="bg-white flex-center ptb30" style="width: 90%;">
					<image src="https://iot-device-saas.oss-cn-shenzhen.aliyuncs.com/public/process.gif"
						style="width: 200px;height: 240px;"></image>
				</view>
			</view>
			<view class="counter mt40">
				<u-count-to class="c-primary f72 bold mt40" ref="uCountTo" :endVal="100" :autoplay="false"></u-count-to>
			</view>

			<view class="f30 bold mt40">正在诊断，请稍后</view>
			<view style="width: 150px;" class="mt100" v-if="showBtn">
				<u-button type="primary" text="重新检测" :throttleTime="1000" @click="toCheck"></u-button>
			</view>
		</view>
	</view>
</template>


<script>
	import dotStatus from "@/components/simple/dot-status";
	import {
		checkCarAPI
	} from "@/api/api/car.js"
	import {
		getStoreSyncUtil
	} from "@/utils/store.js"
	import {
		throttle
	} from '@/utils/utils.js'
	let timer = null;
	let list = {
		"1": {
			key: 1,
			label: "动力系统",
			icon: "chebaba-chelunzhidong",
			catchList: []
		},
		"2": {
			key: 2,
			label: "制动系统",
			icon: "fadongji",
			catchList: []
		},
		"3": {
			key: 3,
			label: "胎压系统",
			icon: "taiya",
			catchList: []
		},
		"4": {
			key: 4,
			label: "电池系统",
			icon: "dianchi",
			catchList: []
		},
		"5": {
			key: 5,
			label: "车联网系统",
			icon: "lichengbiao",
			catchList: []
		},
	}
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				showBtn: false,
			}
		},
		components: {
			dotStatus
		},
		computed: {
			...mapState(["currentBike"])
		},
		onLoad() {
			this.toCheck();
		},
		onUnload() {
			if (timer) {
				clearTimeout(timer);
			}
		},
		methods: {
			toCheck: throttle(function() {
				this.showBtn = false;
				this.$nextTick(() => {
					this.$refs.uCountTo.start();
				})
				checkCarAPI(this.currentBike.id).then(([err, data]) => {
					if (err) {
						this.showBtn = true;
						return;
					}
					// data.codeList = [{parentCode:1,faultCode:'1',faultCodeDes:"e3"}]
					let codeList = data.codeList;
					//检测结果
					let isGood = codeList.length ? false : true;
					for (let key in list) {
						list[key].catchList = [];
					}
					codeList.forEach((item) => {
						list[item.parentCode].catchList.push({
							faultCode: item.faultCode,
							faultCodeDes: item.faultCodeDes
						});
					})
					this.$store.commit('setCheckList', list);
					let timer = setTimeout(() => {
						this.showBtn = true;
						this.$navigateTo('/pagesDetail/views/diagnoseInfo?isGood=' + isGood)
					}, 2000)
				})
			}),
		}

	}
</script>

<style lang="scss">
	.counter {
		.u-count-num {
			color: #06B7F3 !important;
			font-size: 72rpx !important;
			font-weight: bold !important;

			&::after {
				content: " %";
			}
		}
	}
</style>
